<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>header</title>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/imt/js/jquery-3.1.0.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/imt/layui/layui.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/imt/js/system.js"></script>
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/imt/layui/css/layui.css"
	media="all">
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/imt/css/global.css"
	media="all">
<link rel="stylesheet" 
	href="${pageContext.request.contextPath}/imt/css/login.css" />
</head>
<body>
	<!-- 头部Div -->
	<div class="layui-header header header-doc">
		<div class="layui-main">
			<a class="logo" href="/"> <img
				src="${pageContext.request.contextPath}/imt/pic/logo.png"
				alt="IntegrationManagementTool">
			</a>

			<c:choose>
				<%-- 如果登录了 --%>
				<c:when test="${loginFlag == '0'}">
					<ul class="layui-nav" lay-filter="">
						<li class="layui-nav-item"><a href="javascript:toLoginPage()">登录</a></li>
						<li class="layui-nav-item"><a href="javascript:showRegisterDiv()">注册</a></li>
						<!-- <li class="layui-nav-item"><a href="javascript:;">解决方案</a>
						<dl class="layui-nav-child">
							二级菜单
							<dd>
								<a href="">移动模块</a>
							</dd>
							<dd>
								<a href="">后台模版</a>
							</dd>
							<dd>
								<a href="">电商平台</a>
							</dd>
						</dl></li> -->
					</ul>
				</c:when>
				<%-- 如果没登录 --%>
				<c:otherwise>
					<ul class="layui-nav">
						<!-- <li class="layui-nav-item"><a href="">控制台<span
								class="layui-badge">9</span></a></li> -->
						<li class="layui-nav-item"><a href="">个人中心<span
								class="layui-badge-dot"></span></a></li>
						<li class="layui-nav-item"><a href=""><img
								src="http://t.cn/RCzsdCq" class="layui-nav-img">我</a>
							<dl class="layui-nav-child">
								<dd>
									<a href="javascript:;">修改信息</a>
								</dd>
								<dd>
									<a href="javascript:;">安全管理</a>
								</dd>
								<dd>
									<a href="${pageContext.request.contextPath}/loginOut">退了</a>
								</dd>
							</dl></li>
					</ul>
				</c:otherwise>
			</c:choose>
		</div>
	</div>
	
	<!-- 注册Div（隐藏） -->
	<div style="display: none;" id="registerDivHide">
		<div
			style="position: relative; top: 30%; transform: translateY(-50%);">
			<form class="layui-form" action="">
				<table style="margin: 0 auto;">
					<tr>
						<td>用户名</td>
						<td><input type="text" class="layui-input" name="username"
							id="username" /></td>
					</tr>
					<tr>
						<td>密码</td>
						<td><input type="password" class="layui-input"
							name="password" id="password" /></td>
					</tr>
					<tr>
						<td></td>
						<td><div class="layui-btn layui-btn-small"
								onclick="register()">注册</div></td>
					</tr>
				</table>
			</form>
		</div>
	</div>
	
	<!-- 新版登录Div（隐藏） -->
	<div style="display: none;" id="loginDivHide">
		<div class="beg-login-bg">
			<div class="beg-login-box">
				<header>
					<h1>后台登录</h1>
				</header>
				<div class="beg-login-main">
					<form class="layui-form" id="loginForm" action=""><input name="__RequestVerificationToken" type="hidden" value="fkfh8D89BFqTdrE2iiSdG_L781RSRtdWOH411poVUWhxzA5MzI8es07g6KPYQh9Log-xf84pIR2RIAEkOokZL3Ee3UKmX0Jc8bW8jOdhqo81" />
						<div class="layui-form-item">
							<label class="beg-login-icon">
		                       <i class="layui-icon">&#xe612;</i>
		                   </label>
							<input type="text" name="userName" id="username" lay-verify="userName" autocomplete="off" placeholder="这里输入登录名" class="layui-input" value="lk" >
						</div>
						<div class="layui-form-item">
							<label class="beg-login-icon">
		                       <i class="layui-icon">&#xe642;</i>
		                   </label>
							<input type="password" name="userPwd" id="password" lay-verify="password" autocomplete="off" placeholder="这里输入密码" class="layui-input" value="12345" >
						</div>
						<div class="layui-form-item">
							<div class="beg-pull-left beg-login-remember">
								<label>记住帐号？</label>
								<input type="checkbox" name="rememberMe" value="true" lay-skin="switch" checked title="记住帐号">
							</div>
							<div class="beg-pull-right">
								<div class="layui-btn layui-btn-primary" onclick="login()">
		                           <i class="layui-icon">&#xe650;</i> 登录
		                       	</div>
							</div>
							<div class="beg-clear"></div>
						</div>
					</form>
				</div>
				<footer>
					<p>Beginner © www.zhengjinfan.cn</p>
				</footer>
			</div>
		</div>
	</div>
	
</body>

<script>
	
	//首次加载页面执行
	$(document).ready(function() {
		
	});
	
	//注意：导航 依赖 element 模块，否则无法进行功能性操作
	//layui.use('element', function() {
	//	var element = layui.element;
	//});

	//生成element和layer
	layui.use([ 'element', 'layer', 'form' ], function() {
		var $ = layui.jquery;
		var element = layui.element;
		var layer = layui.layer; //独立版的layer无需执行这一句
		var	form = layui.form;
	});

	/* --------------------登录相关start-------------------- */
	//显示登录弹出层（新页面）
	//旧版（加载jsp）
	/* function toLoginPage() {
		//iframe层
		var url = '${pageContext.request.contextPath}/toLoginPage';
		layer.open({
			type : 2,
			title : '登录',
			maxmin : false,
			shadeClose : true,
			shade : 0.8,
			offset : '100px',
			area : [ '600px', '400px' ],
			content : url
		});
	} */
	//新版（加载jsp）
	function toLoginPage() {
		//iframe层
		var url = '${pageContext.request.contextPath}/toLoginPage';
		layer.open({
			type : 2,//类型0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
			content : url,//内容的链接
			move: false,//不可移动
			shadeClose : true,//点击阴影可以关闭
			offset : '0px',//只定义top坐标，水平保持居中
			title: false,//如果你不想显示标题栏，你可以title: false
			area: [ '452px', '420px' ],
			shade : 0.8,
			//area : [ '800px', '800px' ],
			//title : '登录',
			//maxmin : false,
			//
		});
	}
	
	//设置页面跳转
	var _tools = {
			refresh : function() {
				toManagePage();
			}
		}
	window.tools = _tools;
	
	//跳转到管理页
	function toManagePage() {
		window.location.href = "${pageContext.request.contextPath}/toManagePage";
		//lkNote跳转页面的几种方式
		//window.location.href = "http://www.jb51.net";
		//window.location.replace("http://www.jb51.net");
		//$(location).attr('href', 'http://www.jb51.net');
		//$(window).attr('location','http://www.jb51.net');
		//$(location).prop('href', 'http://www.jb51.net')
	}
	
	/* --------------------登录相关end-------------------- */
	
	
	/* --------------------注册相关start-------------------- */
	var registerDivID = "";
	//显示注册弹出层（隐藏Div）
	function showRegisterDiv() {
		//示范一个公告层
		var html = $("#registerDivHide").html();
		registerDivID = layer.open({
			type : 1,
			title : [ '注册', 'font-size:18px;' ],
			offset : '0px',//只定义top坐标，水平保持居中
			skin : 'layui-layer-rim', //加上边框
			area : [ '500px', '300px' ],
			id : 'RegisterDiv',//设定一个id，防止重复弹出
			shadeClose : true,
			content : html,
			success : function(layero) {
				// 样式不好控制，只能弹出层加载完成后在控制
				$("#RegisterDiv").find('table').css('margin', '0 auto');
				$("#RegisterDiv").find('table').find('td')
						.css('padding', '3px');
			}
		});
	}

	/**
	 * 点击注册按钮
	 * cx建议：其实 多字段的数据添加 用新页面更好
	 */
	function register() {
		var username = $("#RegisterDiv").find("#username").val();
		var password = $("#RegisterDiv").find("#password").val();
		console.log(username);
		$.ajax({
			url : "${pageContext.request.contextPath}/register",
			type : 'POST',
			data : {
				userName : username,
				userPwd : password
			},// 
			async : false,/*  */
			dataType : 'text',
			success : function(data) {
				if (data == "OK") {
					layer.alert('注册成功！', {
						closeBtn : 0,
						offset : '200px',
						anim : 5,
						icon : 6
					}, function(index) {
						layer.close(index);
						layer.close(registerDivID);
					});
				} else {
					layer.alert('注册失败！' + data, {
						closeBtn : 0,
						offset : '200px',
						anim : 6,
						icon : 5
					});
				}
			},
			error : function(data) {
				layer.alert('注册出现异常，请稍后再试！' + JSON.stringify(data), {
					closeBtn : 0,
					offset : '200px',
					anim : 6,
					icon : 5
				});
			}
		});
	}
	/* --------------------注册相关end-------------------- */
	
</script>

</html>